<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml" xmlns:th="http://www.thymeleaf.org">
<head th:replace="base::head(~{ztreeBase::ztree})"></head>
<body>
	<div class="x-body layui-anim layui-anim-up">
		<table class="layui-table">
			<colgroup>
				<col width="80">
				<col width="300">
			</colgroup>
			<tr>
				<td>组织机构</td>
				<td>
					<div style="height: 350px; overflow: auto;">
						<ul id="tree" class="ztree"></ul>
					</div>
				</td>
			</tr>
		</table>
		<div class="layui-form-item">
			<a href="javascript:;" id="close" class="layui-btn">关闭</a>
		</div>
	</div>
</body>
<script type="text/javascript" th:inline="javascript">
	var zTreeObj;
	//zTree 的数据属性，深入使用请参考 API 文档（zTreeNode 节点数据详解）$("input[name='status'][value=" + treeNode.status + "]").attr("checked",true);
	var zNodes = [[${zNodes}]];
	//zTree 的参数配置，深入使用请参考 API 文档（setting 配置详解）
	var setting = {
		view : {
			selectedMulti : false
		},
		data : {
			key : {
				name : 'groupName'
			}
		},
		check : {
			enable : false,
			radioType: "all"
		},
		edit : {
			enable: false
		},
		callback: {
			onClick: zTreeOnClick
		}
	};
	//一般直接写在一个js文件中
	layui.use([ "layer", "form" ], function() {
		var layer = layui.layer, form = layui.form;
		//初始化组织机构树
		zTreeObj = $.fn.zTree.init($("#tree"), setting, zNodes);
		//展开全部节点
		zTreeObj.expandAll(true);
		$('#close').on('click', function() {
			admin_close_iframe_window();
		});
	});
	//选中组织机构，返回给选择页面
	function zTreeOnClick(event, treeId, treeNode) {
		parent.loadGroupInfo(treeNode.id,treeNode.groupName);
		admin_close_iframe_window();
	}
</script>
</html>